<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ page isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap-responsive.css" />
    <link rel="stylesheet" type="text/css" href="../Css/style.css" />
    <script type="text/javascript" src="../Js/jquery.js"></script>
    <script type="text/javascript" src="../Js/jquery.sorted.js"></script>
    <script type="text/javascript" src="../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../Js/ckform.js"></script>
    <script type="text/javascript" src="../Js/common.js"></script>

    <style type="text/css">
        body {
            padding-bottom: 40px;
        }
        .sidebar-nav {
            padding: 9px 0;
        }
        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }
    </style>
    <script type="text/javascript">
        $(function () {
            $('#newNav').click(function(){
                window.location.href="addUser.jsp";
            });
        });
        function checkall(){
            var alls=document.getElementsByName("check");
            var ch=document.getElementById("checkall");
            if(ch.checked){
                for(var i=0;i<alls.length;i++){
                    alls[i].checked=true;
                }
            }else{
                for(var i=0;i<alls.length;i++){
                    alls[i].checked=false;
                }
            }
        }
        function delAll(){
            var alls=document.getElementsByName("check");
            var ids=new Array();
            for(var i=0;i<alls.length;i++){
                if(alls[i].checked){
                    ids.push(alls[i].value);
                }
            }
            if(ids.length>0){
                if(confirm("确认删除?")){
                    alert("删除成功!");
                }
            }else{
                alert("请选中要删除的项");
            }
        }
    </script>
</head>
<body>
<form class="form-inline definewidth m20" action="index.jsp" method="get">
    用户名称：
    <input type="text" name="u_username" id="u_username"class="abc input-default" placeholder="" value="">&nbsp;&nbsp;
    <button type="submit" class="btn btn-primary">查询</button>
</form>
<table class="table table-bordered table-hover definewidth m10">
    <thead>
    <tr>
        <th width="5%"><input type="checkbox" id="checkall" onChange="checkall();"></th>
        <th>用户账户</th>
        <th>真实姓名</th>
        <th>角色</th>
        <th  width="10%">操作</th>
    </tr>
    </thead>
    <tr>
        <c:forEach items="${map}" var="map">
        <td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
        <td>${map.key}</td>
        <td>
            <c:forEach items="${map.value}" var="set" begin="0" end="0">
            ${set.u_name}
            </c:forEach>
        </td>
        <td>
            <c:forEach items="${map.value}" var="set">
            <c:forEach items="${set.roles}" var="role">
                ${role.r_name}
            </c:forEach>
            </c:forEach>
        </td>

        <td>
            <a href="editUser.jsp">编辑</a>&nbsp;&nbsp;&nbsp;<a href="javascript:alert('删除成功！');">删除</a>
        </td>
    </tr>
    </c:forEach>
</table>
<table class="table table-bordered table-hover definewidth m10" >
    <tr><th colspan="5">  <div class="inline pull-right page">
        ${count} 条记录 ${page}/${countPage} 页
            <a href='/user/list.action?page=1'>首页</a>
            <c:if test="${page==1}">
                上一页
            </c:if>
            <c:if test="${page>1}">
            <a href='/user/list.action?page=${page-1}'>上一页</a>
            </c:if>
            <c:if test="${page==countPage}">
                下一页
            </c:if>
            <c:if test="${page!=countPage}">
            <a href='/user/list.action?page=${page+1}'>下一页</a>
            </c:if>
            <a href='/user/list.action?page=${countPage}' >最后一页</a>

    </div>
        <div>
            <button type="button" class="btn btn-success" id="newNav">添加用户</button>
            &nbsp;&nbsp;&nbsp;
            <button type="button" class="btn btn-success" id="delPro" onClick="delAll();">删除选中</button>
        </div></th></tr>
</table>
</body>
</html>